// pages/edit/edit.js
import { request, toast } from '../../utils/wxCommon'
import { DateUtil } from '../../utils/util'
Page({

  /**
   * 页面的初始数据
   */
  data: {
    value: '',
    introduce: '',
    fileList: [
      {
        url: 'https://img.yzcdn.cn/vant/leaf.jpg',
        name: '图片1',
        deletable: true,
      },
    ],
    logoUrl: '',
    html:'',
    isUpdate: false,
    logoImg: ''
  },
  //获取用户输入的主题和简介
  onChange(e){
    console.log(e)
    const type = e.currentTarget.dataset.type;
    const value = e.detail;
    if(type == 1){
      this.data.value = value;
    }else{
      this.data.introduce = value;
    }
  },
  //从组件获取值,markDown 的数据
  getHtml(e) {
    this.data.html = e.detail.content.html
  },
  //图片上传插入示例(将图片插入到markDown中进行的操作)
  insertImage(){ 
    wx.chooseMedia({
      count: 1,
      mediaType: ['image'],
      success: res => {
        console.log('文本照顾你差多阿闪大大',res)
        console.log('插入图片获取路径',res.tempFiles[0].tempFilePath);
        this.uploadImg(res.tempFiles[0].tempFilePath,'htmlImg');
       
      }
    })
  },
  //上传图片到云存储
  uploadImg(filePath, type = 'logo'){
    const openid = wx.getStorageSync('usreInfo').openid;
    const url = this.data.logoUrl.split('//')[1]
    console.log(url)
    console.log( 'editArticle/'+openid+`/logo/${url}/1.png`)
    wx.cloud.uploadFile({
      cloudPath: type == 'logo' ? 'editArticle/'+openid+`/logo/${url}` :  'editArticle/'+openid+`/htmlImg/${url}`, // 上传至云端的路径
      filePath, // 小程序临时文件路径
      success: res => {
        // 返回文件 ID
        console.log('图片上传成功',res.fileID)
        if(type != 'logo'){
          this.data.htmlImg = res.fileID
           // 本地测试图片插入
          this.selectComponent('#hf_editor').insertSrc(res.fileID);
        }else{//富文本图片
          console.log('============','走了么')
          this.data.logoImg = res.fileID
          this.data.logoImg &&  this.subList();
        }
       
      },
      fail: msg=>{
        console.log('图片上传失败',msg)
      }
    })
  },
  //最终的提交
  submit() {
    this.data.logoUrl && this.uploadImg(this.data.logoUrl, 'logo');
    !this.data.logoUrl && this.subList();
    console.log('提交的富文本', this.data.html)
  },
  subList(){
    const params = {
      openid:wx.getStorageSync('usreInfo').openid || '',
      introduce: this.data.introduce,
      title: this.data.value,
      logo: !this.data.logoImg ? 'https://img.yzcdn.cn/vant/leaf.jpg' : this.data.logoImg,
      detail: this.data.html,
      time: DateUtil.now(),//创建时间
      type: !this.data.isUpdate ? 6 : 8,
      id:  !this.data.isUpdate ? 0 : this.data.id
    }
    request('user',params).then(res=>{
      console.log('提交成功',res);
      if(res.result.status === 'S'){
        wx.removeStorageSync('detail')
        wx.switchTab({
          url: '/pages/index/index',
        })
      }
    }).catch(msg=>{
      console.log('提交失败',msg);
    })
  },
  //读取上传的图片
  readFile(e){
    console.log(e)
    const url = e.detail.file.url;
    this.data.logoUrl = url;//获取上传图片的路径
    let obj = {
      url,
      name: '图片1',
      deletable: true,
    }
    this.data.fileList.push(obj);
    this.setData({
      fileList: this.data.fileList
    })
  },
  //点击删除logo图片
  deleteLogo(e){
    console.log(e)
    const { index } = e.detail.index
    this.data.fileList.splice(index,1);
    this.setData({
      fileList: this.data.fileList
    })
  },  
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    if(wx.getStorageSync('detail')){
      const list = wx.getStorageSync('detail')
      
      this.setData({
        value: list.title,
        introduce: list.introduce,
        fileList: [{url: list.logo, deletable: true}],
        isUpdate: true,
        logoImg: list.logo
      })
      this.data.html = list.detail
      this.data.id = list._id
      //回显例子
      this.selectComponent('#hf_editor').setHtml(list.detail);
    }
  
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {
    
  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {
    
  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  }
})